import React from 'react';
import { Modal, Form, Input,  Select } from 'antd';

interface AddPanelModelProps {
  visible: boolean;
  onCancel: () => void;
}

const AddPanelModel: React.FC<AddPanelModelProps> = (props) => {
  const { visible, onCancel } = props;
  const [form] = Form.useForm();
  const { validateFields } = form;

  // 创建看板
  const establish = () => {
    validateFields().then(async (values) => {
      console.log(values);
    });
  };


  return (
    <Modal
      title="创建看板"
      destroyOnClose
      visible={visible}
      onOk={establish}
      onCancel={() => {
        onCancel();
      }}
    >
        <Form name="form" form={form}>
          <Form.Item name="note" label="看板名称" rules={[{ required: true }]}>
            <Input />
          </Form.Item>
          <Form.Item name="gender" label="归属项目" rules={[{ required: true }]}>
            <Select
              // onChange={this.onGenderChange}
              allowClear
            >
              <Select.Option value="male">male</Select.Option>
              <Select.Option value="female">female</Select.Option>
              <Select.Option value="other">other</Select.Option>
            </Select>
          </Form.Item>
        </Form>

    </Modal>
  );
};

export default AddPanelModel;
